<template>
    <div class="">
        son 组件 ---{{ value }}
        <input type="text" @change="inputEvent">
        <!-- <input type="text"> -->


        <button @click="$emit('update:modelValue', 1000)">改变1 count</button>
        <button @click="clickHandler">改变2 count</button>
    </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
import { reactive, toRefs, ref } from "vue"


export default {
    // props: {
    //     value: {
    //         type: String
    //     }
    // },
    props: ['value'],
    name: "",
    //import引入的组件需要注入到对象中才能使用
    components: {},
    //这里存放数据
    setup (props, { emit }) {
        const data = reactive({})
        const inputEvent = (e) => {

            emit('inputClick', e.target.value)  //  遇到表单的时候 触发事件 建议不要用关键字

        }

        const clickHandler = () => {
            emit('update:modelValue', 10000)
        }


        return {
            data,
            inputEvent,
            clickHandler
        }
    }
}
</script>

<style lang="css" scoped>
</style>
